<template>
  <div class="rpm-list-checkbox" v-loading = "loading" >    
    <template v-for="item in datas">
      <template v-if="item.type == 0">
        <!-- {{item}} -->
        <el-checkbox :checked="item.rpmid == null? false: true" :key="item.id" @change="onClickVisableCheckbox(item,$event)">可见</el-checkbox>
      </template>      
    </template>
  </div>
</template>

<script lang="ts">
import { defineComponent } from 'vue'
import { useStore } from 'vuex'
import { ElMessage } from 'element-plus'

import { updatePermissionApi } from "@/manager-core/api/rolePermissionModule/rolePermissionModule";



export default defineComponent({
  name: 'rolePermissionModuleListCheckbox',

  props: {
    datas :{
      type: Array
    }
  },

  components: {
    
  },

  data(){
    return {  
      id: "" as any,
      loading : false,
      checked: false    
    }
  },

  methods:{
    init(){
    },
    onClickVisableCheckbox(item:any, e:any){
      let id = item.id;
      let rid = this.id;
      let check = e;
      this.loading = true;

      updatePermissionApi(id,rid,check)
        .then((r:any) =>{

        })
        .finally(()=>{
          this.loading = false;
        })
    }
  },

  mounted(){
    let id = this.$route.query.id;
    if(!id){
      alert("页面错误，请刷新")
    }
    else {
      this.id = id;
      this.init();
    }
  },

  created(){
    let id = this.$route.query.id;
    if(!id){
      alert("页面错误，请刷新")
    }
    else {
      this.id = id;
      this.init();
    }
  },

  setup(){
    // const store = useStore()

    // return {
    //   LoginByUsername:(userObj:any)=> store.dispatch('LoginByUsername')
    // }

  }


})



</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss" scoped>
  .custom-tree-node {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 14px;
    padding-right: 8px;
  }

  .role-module-input-tree{
    width: 600px;
  }

  .role-module-input-box{
    padding-left: 20px;
  }
</style>
